<template>
	<div class="record-bg u-page">
		<u-navbar :title="title" :custom-back="comeBackCustom" :back-icon-name="backIconName" :border-bottom="false"
			title-width="380"></u-navbar>
		<div>
			<div class="u-pb-10 u-pl-10 u-pr-10" style="background-color: #ffffff;" v-if="logisticsDynamic.ftime">
				<div class="u-text-center u-fz-15 u-pt-5" v-if="automaticReceiptDays">
					剩余{{automaticReceiptDays?automaticReceiptDays:''}}天自动确认收货</div>
				<div class="u-flex u-pt-10" @click="toLogisticsInfo">
					<div class="car-icon"></div>
					<div style="display: flex;flex-direction: column;;justify-content: center;width: 85%;">
						<div
							style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 32rpx;color: #5dc710;">
							{{logisticsDynamic.context}}</div>
						<div style="color: #bcbcbc;">{{logisticsDynamic.ftime}}</div>
					</div>
					<div class="right-icon u-pl-5"></div>
				</div>
			</div>

			<div class="bg-white u-pb-15">
				<div class="u-border-top u-pt-15" style="width: 93%;margin: 0 auto;">
					<div style="display: flex;justify-content: space-between;align-items: center;">
						<div class="cont-right">
							<div class="u-flex u-fz-13">
								<span class='address1'>{{form.consigneeAddress.split(" ")[0]}}</span>
							</div>
							<div class="u-title u-fz-20 u-pt-5">{{form.consigneeAddress.split(" ")[1]}}</div>
							<div class="u-pt-5 u-fz-15">
								<span>{{form.consigneeName}}</span>
								<span class="u-pl-5">{{form.consigneePhoneNum}}</span>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="bg-white border-radius-30 u-pb-10">
				<div class="aui-flex1 u-mt-10 u-pt-15" @click="toGoodsDetails">
					<div class="aui-flex-goods">
						<img :src="form.goodsImages.split(',')[0]" alt="">
					</div>
					<div class="aui-flex-box">
						<div class="goods-title">
							{{form.goodsName?form.goodsName:''}}
						</div>
						<div class="goods-specification">{{form.specification?form.specification:'暂无规格'}}</div>
						<div style="padding-top: 15rpx;">
							<u-tag text="样品推广" color="#40972f" border-color="#40972f" bg-color="#ffffff" size="mini"
								mode="light" />
						</div>
					</div>
				</div>
				<!-- <div class="u-pr-25" style="display: flex;flex-direction: row-reverse;">
					<div class="u-flex u-fz-15">
						<div>共{{form.quantity?form.quantity:0}}件</div>
						<div class="u-pl-5">
							实付：<span class="u-title">&yen;{{form.payAmount?form.payAmount:'0.00'}}</span>
						</div>
					</div>
				</div> -->
				
				<div class="aui-flex2 aui-choice-white b-line">
					<div class="aui-flex-box">样品总价</div>
					<div class="aui-flex-triangle">&yen;{{form.samplePrice}}</div>
				</div>
				<div class="aui-flex2 aui-choice-white b-line">
					<div class="aui-flex-box">运费</div>
					<div class="aui-flex-triangle">&yen;0.00</div>
				</div>
				<div class="aui-flex2 aui-choice-white b-line">
					<div class="aui-flex-box">优惠券</div>
					<div class="aui-flex-triangle">-&yen;{{form.couponAmount}}</div>
				</div>
				<div class="aui-flex2 aui-choice-white b-line">
					<div class="aui-flex-box">钱包抵扣金额</div>
					<div class="aui-flex-triangle">-&yen;{{form.deductionAmount}}</div>
				</div>
				<div class="aui-flex2 aui-choice-white b-line">
					<div class="aui-flex-box">实付款</div>
					<div class="aui-flex-triangle cont-red">&yen;{{form.payAmount}}</div>
				</div>
				
				<p class="v-sperate"></p>
				<div class="aui-flex2 aui-choice-white u-mt-5 u-mb-5">
					<div class="aui-flex-box">备注</div>
					<div class="u-fz-15">
						{{form.orderRemarks?form.orderRemarks:''}}
					</div>
				</div>
				
				<div class="aui-flex2 aui-choice-white u-mt-5 u-mb-5">
					<div class="aui-flex-box">订单编号</div>
					<div class="u-fz-15 u-flex">
						<div class="order-id">
							{{form.orderId?form.orderId:''}}
						</div>
						<span class="copy-btn tpink-btn-color" @click="longpressCopy(form.orderId,'已复制')">复制</span>
					</div>
				</div>
				
				<div class="aui-flex2 aui-choice-white u-mt-5 u-mb-5">
					<div class="aui-flex-box">下单时间</div>
					<div class="u-fz-15">
						{{form.createTime?form.createTime:''}}
					</div>
				</div>

				<p class="v-sperate"></p>
				<section class="j-block width93">
					<div class="modal-item" @click="showRules">
						<div style="font-weight: bold;">
							【非常重要！请仔细阅读！】
						</div>
						<div style="font-size: smaller;">
							<u-icon :name="iconName" color="#9f9d9e" size="24"></u-icon>
						</div>
					</div>

					<div v-if="show_rule">
						<div class="rule-title">
							试用要求
						</div>
						<div class="rule-content">
							<u-parse :html="this.escape2Html2(mainData.requiredContent)"></u-parse>
						</div>

						<div class="rule-title">
							评级标准
						</div>
						<div class="rule-content">
							<u-parse :html="this.escape2Html2(mainData.ratingCriteria)"></u-parse>
						</div>

						<div class="rule-title">
							领取规则
						</div>
						<div class="rule-content">
							<u-parse :html="this.escape2Html2(claimRules)"></u-parse>
						</div>
					</div>
				</section>
			</div>

			<!-- 评论 -->
			<div class="bg-white u-mt-10 u-mb-100 u-pb-10 border-radius-30" v-if="mainData.enableFeedback == '1'">
				
				<div v-if="mainData.enableReport == '1'">
					<div class="comment-title">试用报告</div>
					<div style="width: 90%;margin: 0 auto;">
						<div class="u-pt-15 u-pb-15 u-pl-10">{{form.feedbackContent}}</div>
					</div>
				</div>
				
				<div v-if="mainData.enableMaterial == '1'">
					<div class="comment-title">试用素材</div>
					<div style="width: 90%;margin: 0 auto;padding-top: 30rpx;">
						<div class="pictrues-box u-pl-5" v-if="form.feedbackPictures">
							<div v-for="(item,index) in feedbackPicturesArr" :key="index"
								style="padding: 10rpx;position: relative;" @click="previewPictrueOrVideo(item,'png')">
								<u-image width="200rpx" height="200rpx" :src="item"></u-image>
							</div>
						</div>
					</div>
				</div>
				
				<div v-if="mainData.enableSocial == '1'">
					<div class="comment-title">社交平台截图凭证</div>
					<div style="width: 90%;margin: 0 auto;padding-top: 30rpx;">
						<div class="pictrues-box u-pl-5" v-if="form.socialPlatformPictures">
							<div v-for="(item,index) in socialPlatformPicturesArr" :key="index"
								style="padding: 10rpx;position: relative;" @click="previewPictrueOrVideo(item,'png')">
								<u-image width="200rpx" height="200rpx" :src="item"></u-image>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div style="height: 300rpx;"></div>

			<!-- 按钮 -->
			<div style="position: fixed;bottom: 0rpx;background-color: #FFFFFF;width: 100%;z-index: 3;">
				<div class="notice-bar2" v-if="form.grade && isConsumerOfOrder" @click="goToIncomeIndex">
					您获{{form.grade?form.grade:''}}级评价<span v-if="bottomPromptText">{{bottomPromptText}}</span>
				</div>
				<div class="notice-bar" v-if="!form.grade && isConsumerOfOrder">
					<span style="text-decoration: underline;" @click="showOfficialAccount">关注公众号</span>，及时获取物流进度</span>
				</div>
				<div class="notice-bar2" v-if="form.grade && isCreator">
					{{form.grade?form.grade:''}}级评价<span v-if="bottomPromptText">{{bottomPromptText}}</span>
				</div>

				<div class="u-pt-10 u-pb-30">
					<div class="u-pr-15" style="display: flex;flex-direction: row-reverse;">
						<div v-if="isCreator && title == '已评价'">
							<!-- <u-button shape="circle" size="mini" :custom-style="customStyle1" @click="grade_show = true">评级</u-button> -->
							<u-button shape="circle" size="mini" :custom-style="customStyle1" @click="grade_show = true"
								v-if="!form.grade">评级</u-button>
							<u-button shape="circle" size="mini" :custom-style="customStyle3" hover-class="none"
								v-if="gradeName">{{gradeName}}</u-button>
						</div>
						<div v-if="isConsumerOfOrder">
							<u-button shape="circle" size="mini" :custom-style="customStyle2"
								@click="toAnotherOrder">再来一单</u-button>
							<u-button shape="circle" size="mini" :custom-style="customStyle2" v-if="title != '已退款'"
								@click="openCustomerServiceChat">退换/售后</u-button>
							<u-button shape="circle" size="mini" :custom-style="customStyle1" v-if="title == '待收货'"
								@click="confirmReceipt">确认收货</u-button>
							<u-button shape="circle" size="mini" :custom-style="customStyle1" v-if="title == '待评价'"
								@click="toEvaluate">评价</u-button>
							<u-button shape="circle" size="mini" :custom-style="customStyle3" hover-class="none"
								v-if="title == '已评价' && gradeName == ''" @click="toEvaluate">修改评价</u-button>
							<u-button shape="circle" size="mini" :custom-style="customStyle3" hover-class="none"
								v-if="title == '已评价' && gradeName">{{gradeName}}</u-button>
						</div>
					</div>
				</div>
			</div>

			<!-- 选择评级 -->
			<u-picker v-model="grade_show" mode="selector" :default-selector="[0]" :range="gradeList" range-key="lable"
				@confirm="toGrade"></u-picker>

			<!-- 模态框 -->
			<u-modal v-model="customerService_show" confirm-text="关闭" title="客服微信">
				<view class="slot-content">
					<rich-text :nodes="this.escape2Html(customerService.topPrompt)"></rich-text>
					<div class="u-center u-pt-5 u-pb-5">
						<u-image width="300rpx" height="300rpx" :src="customerService.csQrCode"
							@longpress="saveImg"></u-image>
					</div>
					<rich-text :nodes="this.escape2Html(customerService.bottomPrompt)"></rich-text>
				</view>
			</u-modal>

			<!-- 商品返现已到账 -->
			<u-modal v-model="scenario_show" confirm-text="查看收益" title="商品返现已到账" @confirm="goToIncomeIndex">
				<div class="slot-content3">
					<span
						class="color-red">{{goods.goodsName?goods.goodsName:''}}</span>团购活动已达到品牌返现标准，您参与购买{{form.buyQuantity?form.buyQuantity:''}}件商品，获返现<span
						class="color-red">¥{{goods.foremanReward?goods.foremanReward:'0'}}</span>元。
				</div>
			</u-modal>

			<!-- 关注公众号弹窗 -->
			<u-mask :show="official_account_show" :mask-click-able="false" z-index="9999" mask-click-able="true"
				@click="closeOfficialAccount">
				<div class="mask-solt">
					<div>
						<div class="official-account-bg"></div>
					</div>
				</div>
			</u-mask>
		</div>

		<!-- 弹窗生成海报 -->
		<u-modal v-model="poster_modal_show" confirm-text="完成3名好友扫码即可返现" confirm-color="#e55e97" :mask-close-able="true"
			:show-title="false" @confirm="SaveAlbum(PosterURL)">
			<u-image :src="PosterURL" mode="widthFix" @longpress="saveImg(PosterURL)"></u-image>
		</u-modal>

		<!-- 弹窗评级 -->
		<u-modal v-model="grade_modal_show" confirm-text="确认" confirm-color="#e55e97" :mask-close-able="true"
			:show-title="false" @confirm="sureGrade">
			<div class="slot-content3">
				是否将此用户的评价评为<span class="color-red">{{form.grade?form.grade:''}}</span>，并发放<span
					class="color-red">¥{{form.reward?form.reward:'0'}}</span>元报酬和<span
					class="color-red">¥{{form.couponAmount?form.couponAmount:'0'}}</span>元优惠券。
			</div>
		</u-modal>

	</div>
</template>

<script>
	import {
		COS
	} from '../../common/js/cos-wx-sdk-v5.min';
	import globalData from "@/globalData";
	export default {
		data() {
			return {
				customerServiceId: '', // 客服id
				customerService: {}, // 客服信息
				customerService_show: false,
				automaticReceiptDays: '', // 自动收货剩余天数
				isConsumerOfOrder: false, // 当前用户是否为此订单的消费者
				receipt_show: false,
				title: '订单详情',
				comeback: 0, //自定义返回路径 0为返回上一页，1为返回我的订单列表
				backIconName: 'nav-back',
				form: {}, // 订单信息
				mainData: {},// 样品活动详情
				goods: {}, // 商品信息
				addressObj: {}, // 收货地址
				showBtn: false, // 是否显示“前往订单列表”按钮，默认不显示
				isCreator: false, //当前用户是否为此订单的团长
				scenario: '',
				scenario_show: false,
				customStyle1: {
					borderRadius: '20rpx',
					color: '#eb5468',
					marginLeft: '8rpx',
					fontSize: '28rpx',
					padding: '0rpx 20rpx',
					height: '60rpx',
					lineHeight: '60rpx'
				},
				customStyle2: {
					borderRadius: '20rpx',
					color: '#000000',
					marginLeft: '8rpx',
					fontSize: '28rpx',
					padding: '0rpx 20rpx',
					height: '60rpx',
					lineHeight: '60rpx'
				},
				customStyle3: {
					borderRadius: '20rpx',
					marginLeft: '8rpx',
					fontSize: '28rpx',
					padding: '0rpx 20rpx',
					height: '60rpx',
					lineHeight: '60rpx',
				},
				logisticsDynamic: {}, //最新物流信息
				official_account_show: false, //关注公众号弹窗标志
				feedbackPicturesArr: [], //反馈图片数据
				socialPlatformPicturesArr: [], //社交平台截图凭证
				mainData: {},
				show_rule: true,
				claimRules: '领取样品后，需完成产品试用，并按照试用要求提交评价，达到评级标准的平台会发放相应的报酬！如未完成评价，则会限制您继续参与其他样品活动，敬请谅解～',
				isCreator: false, // 是否为发起人
				grade_show: false,
				grade_modal_show: false,
				gradeList: [{
						id: 'A',
						lable: 'A'
					},
					{
						id: 'B',
						lable: 'B'
					},
					{
						id: 'C',
						lable: 'C'
					}
				],
				iconName: 'arrow-down',
				gradeName: '',
				bottomPromptText: '',
				officialAccountUrl: 'https://mp.weixin.qq.com/s/IYKtVOzoorlNeIXBB4yhjQ',
				temp_grade: '',// 评级
			}
		},

		onLoad(options) {
			// 未登录跳转到登录页面
			let loginRes = this.checkLogin();
			if (!loginRes) {
				return false;
			}

			if (this.isNotNull(options.comeback)) {
				this.comeback = options.comeback;
				if (this.comeback == 1) {
					this.backIconName = 'list-dot'
				}
			}

			if (this.isNotNull(options.recordId)) {
				// 获取领取记录(订单)详情
				this.getRecordDetails(options.recordId);
			}

			//评价完成后回调
			uni.$on("finishOrder", (orderId) => {
				if (this.isNotNull(orderId)) {
					this.getRecordDetails(this.form.id)
				}
			});
		},

		methods: {

			/**
			 * uview自定义导航栏返回上一页
			 */
			comeBackCustom() {
				let pages = getCurrentPages()
				if (this.comeback == 1) {
					uni.reLaunch({
						url: '/pages_private_scene2/GroupPurchase/OrderList?comeback=personalIndex'
					});
				} else if (pages[pages.length - 2]) {
					//如果有上一页，就返回上一页
					this.goBack()
				} else {
					//如果没有上一页，则返回首页
					uni.reLaunch({
						url: '/pages/index/index'
					});
				}
			},

			/**
			 * 获取订单详情
			 */
			async getRecordDetails(recordId) {
				let result = await this.$u.api.unifyMiniRestGet({
					systemid: "meily",
					url: "/provide/samples/sub/info/" + recordId,
					loading: false // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					this.form = result.data;

					if (this.form.partnerId == uni.getStorageSync('userInfo').userId) {
						// 当前用户是此订单的消费者
						this.isConsumerOfOrder = true;
					}

					if (this.form.initiatorId == uni.getStorageSync('userInfo').userId) {
						// 当前用户是此活动的发起人
						this.isCreator = true;
					}

					// 获取活动详情
					this.getActivityDetails(this.form.mainId);

					// 订单状态
					this.title = this.form.orderStatus

					// 等级
					if (this.isNotNull(this.form.grade)) {
						this.gradeName = this.form.grade + '级'
					}

					// 反馈图片数据，避免页面元素使用split函数报错问题
					if (this.form.feedbackPictures) {
						this.feedbackPicturesArr = this.form.feedbackPictures.split(',')
					}
					if (this.form.socialPlatformPictures) {
						this.socialPlatformPicturesArr = this.form.socialPlatformPictures.split(',')
					}
					
					// 查询物流数据
					if(this.form.orderStatus != '待发货'){
						this.getLogisticsData(this.form.id);
					}
					
					if (this.form.orderStatus == '已评价') {
						this.iconName = 'arrow-right'
						this.show_rule = false
					}
					
					// 评级后的底部文字提示
					this.updateBottomPromptText()

					// 获取样品活动详情
					if (this.isNotNull(this.form.mainId)) {
						let result2 = await this.$u.api.unifyMiniRestGet({
							systemid: "meily",
							url: "/provide/samples/info/" + this.form.mainId,
							loading: false // 默认发起请求会有一个全局的Loading，设置false可去掉
						});
						if (result2.code == 200) {
							this.mainData = result2.data
							this.gradeList.forEach((item, index) => {
								if (item.id == 'A') {
									let coupon_range = ''
									if(this.mainData.levelACouponRange == 0){
										coupon_range = '(单品券)'
									}else if(this.mainData.levelACouponRange == 1){
										coupon_range = '(通用券)'
									}
									item.lable = 'A级：' + this.mainData.levelAReward + '元，' + this.mainData
										.levelACouponAmount + '元优惠券' + coupon_range
								} else if (item.id == 'B') {
									let coupon_range = ''
									if(this.mainData.levelBCouponRange == 0){
										coupon_range = '(单品券)'
									}else if(this.mainData.levelBCouponRange == 1){
										coupon_range = '(通用券)'
									}
									item.lable = 'B级：' + this.mainData.levelBReward + '元，' + this.mainData
										.levelBCouponAmount + '元优惠券' + coupon_range
								} else if (item.id == 'C') {
									let coupon_range = ''
									if(this.mainData.levelCCouponRange == 0){
										coupon_range = '(单品券)'
									}else if(this.mainData.levelCCouponRange == 1){
										coupon_range = '(通用券)'
									}
									item.lable = 'C级：' + this.mainData.levelCReward + '元，' + this.mainData
										.levelCCouponAmount + '元优惠券' + coupon_range
								}
								// // 第一个参数是要修改的数据, 第二个值是修改当前数组的哪一个字段,第三个是要修改为什么值
								// this.$set(this.gradeList[index], `lable`, item.lable);
							});
						}
					}

				} else {
					this.showMSG("error", result.msg);
					setTimeout(() => {
						this.goBack()
					}, 2500)
				}
			},

			/**
			 * 获取活动详情
			 */
			async getActivityDetails(docUnid) {
				let result = await this.$u.api.unifyMiniRestGet({
					systemid: "meily",
					url: "/provide/samples/info/" + docUnid,
					loading: true // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					this.customerServiceId = result.data.customerServiceId;
					this.mainData = result.data;
					// 获取样品客服详情
					// this.getCSInfo(result.data.customerServiceId);
				} else {
					this.$u.toast(result.msg)
				}
			},

			/**
			 * 获取样品客服详情
			 */
			async getCSInfo(helpCsId) {
				let result = await this.$u.api.unifyMiniRestGet({
					systemid: "meily",
					url: "/clientele/get/" + helpCsId,
				});
				if (result.code == 200) {
					this.customerService = result.data;
				}
			},

			/**
			 * 是否确认收货
			 */
			receipt() {
				this.receipt_show = true;
			},

			/** 
			 * 确认收货
			 */
			async confirmReceipt() {
				let result = await this.$u.api.unifyMiniRest({
					systemid: "meily",
					url: "/provide/samples/sub/confirmReceipt",
					id: this.form.id,
					loading: false // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					this.form = result.data;
					this.title = this.form.orderStatus
					// 等级
					if (this.isNotNull(this.form.grade)) {
						this.gradeName = this.form.grade + '级'
					}
					this.automaticReceiptDays = ''
					this.showMSG("success", "收货成功！");
				} else {
					this.showMSG("error", "收货失败！");
				}
			},

			/**
			 * 前往“订单列表”
			 */
			goToOrderList() {
				uni.reLaunch({
					url: "/pages_private_scene2/GroupPurchase/OrderList"
				});
			},

			/**
			 * 退换、售后（点击联系客服）
			 */
			AfterSales() {
				if (this.isNotNull(this.customerService.csQrCode)) {
					this.customerService_show = true
				} else {
					this.showMSG('none', '请联系平台管理员')
				}
			},

			/**
			 * 点击联系客服
			 */
			async openCustomerServiceChat() {
				let result = await this.$u.api.unifyMiniRestGet({
					systemid: "meily",
					url: "/qyapi/kf/account/url/".concat(globalData.openKfid_sample),
					loading: true // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					let rows = result.data;
					if (rows.length > 0) {
						const pages = getCurrentPages(); // 获取栈实例
						//当前页面路径(带参数)
						let currentPage = pages[pages.length - 1]['$page']['fullPath']
						let kfUrl = rows[0].kfUrl
						wx.openCustomerServiceChat({
							extInfo: {
								url: kfUrl
							},
							corpId: globalData.corpId,
							showMessageCard: true,
							sendMessagePath: currentPage,
							success(res) {
								console.log(res)
							}
						});
					}
				} else {
					this.showMSG('error', '出错啦！');
				}
			},

			/**
			 * 点击物流单号跳转到查询物流信息页面
			 */
			toLogisticsInfo() {
				this.$u.route('/pages_tabbar_contact/common_contact/queryLogisticsInfo?id=' + this.form.id +
					'&logisticsModule=SAMPLES')
			},

			// toast生成中
			showLoading() {
				wx.showLoading({
					title: '正在生成中...',
					icon: 'none',
				});
			},

			hideLoading() {
				wx.hideLoading();
			},

			// 长按保存图片
			saveImg(url) {
				//用户需要授权
				wx.getSetting({
					success: (res) => {
						if (!res.authSetting['scope.writePhotosAlbum']) {
							wx.authorize({
								scope: 'scope.writePhotosAlbum',
								success: () => {
									// 同意授权
									this.saveImg1(url);
								},
								fail: (res) => {
									console.log(res);
								}
							})
						} else {
							// 已经授权了
							this.saveImg1(url);
						}
					},
					fail: (res) => {
						console.log(res);
					}
				})
			},

			/**
			 * 保存到相册
			 */
			SaveAlbum(url) {
				wx.getImageInfo({
					src: url,
					success: (res) => {
						let path = res.path;
						wx.saveImageToPhotosAlbum({
							filePath: path,
							success: (res) => {
								this.showMSG("success", "保存成功！")
							},
							fail: (res) => {
								console.log("----SaveAlbum fail---")
								console.log(res);
								this.$u.toast("请点击右上角进入设置并开启添加到相册的权限才能保存到相册噢！")
							}
						})
					},
					fail: (res) => {
						console.log(res);
					}
				})
			},

			/** 
			 * 复制链接
			 */
			copyLink(link) {
				wx.setClipboardData({
					//准备复制的数据内容
					data: link,
					success: function(res) {
						wx.showToast({
							title: '已复制',
						});
					}
				});
			},

			/**
			 * 查询物流数据
			 */
			async getLogisticsData(id) {
				let result = await this.$u.api.unifyMiniRest({
					systemid: "meily",
					url: "/express/query/realTime/logistics",
					id: id,
					logisticsModule: "SAMPLES",
					loading: true // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					if (this.isNotNull(result.data.automaticReceiptDays)) {
						let days = Number(result.data.automaticReceiptDays);
						if (days >= 0 && this.form.orderStatus == '待收货') {
							this.automaticReceiptDays = result.data.automaticReceiptDays
						}
					}
					this.logisticsDynamic = result.data.logisticsDynamicList[0]
				}
			},

			/** 
			 * 关注公众号弹窗
			 */
			showOfficialAccount() {
				this.routeAD(this.officialAccountUrl,'outside')
			},

			/**
			 * 关闭公众号弹窗
			 */
			closeOfficialAccount() {
				this.official_account_show = false
			},

			/**
			 * 点击“评价”按钮
			 */
			toEvaluate() {
				this.$u.route('pages_private_scene2/provide_samples/trial_feedback?recordId=' + this.form.id)
			},

			/**
			 * 点击“再来一单”按钮
			 */
			toAnotherOrder() {
				// 跳转到销售机会页面
				this.$u.route('/pages_private_scene2/GroupPurchase/DistributionGoods?goodsNo=' + this.form.goodsNo +
					'&goodsId=' + this.form.goodsId)
			},

			/**
			 * 点击“评级”按钮
			 */
			toGrade($event) {
				let obj = this.gradeList[$event]
				console.log("obj=", obj);
				this.grade_modal_show = true;
				this.temp_grade = obj.id;
				// this.form.grade = obj.id;

				if (this.temp_grade == 'A') {
					this.form.reward = this.mainData.levelAReward;
					this.form.couponAmount = this.mainData.levelACouponAmount;
					this.form.couponRange = this.mainData.levelACouponRange;
				} else if (this.temp_grade == 'B') {
					this.form.reward = this.mainData.levelBReward;
					this.form.couponAmount = this.mainData.levelBCouponAmount;
					this.form.couponRange = this.mainData.levelBCouponRange;
				} else if (this.temp_grade == 'C') {
					this.form.reward = this.mainData.levelCReward;
					this.form.couponAmount = this.mainData.levelCCouponAmount;
					this.form.couponRange = this.mainData.levelCCouponRange;
				}
			},

			/**
			 * 确认“评级”
			 */
			async sureGrade() {
				console.log("确认“评级”.....");
				let result = await this.$u.api.unifyMiniRest({
					systemid: "meily",
					url: "/provide/samples/sub/rating",
					id: this.form.id,
					// grade: this.form.grade,
					grade: this.temp_grade,
					reward: this.form.reward,
					couponAmount: this.form.couponAmount,
					couponRange: this.form.couponRange,
					loading: false // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					this.form = result.data;
					this.title = this.form.orderStatus
					// 等级
					if (this.isNotNull(this.form.grade)) {
						this.gradeName = this.form.grade + '级'
					}
					//更新评级后底部文字提示
					this.updateBottomPromptText()
					this.showMSG("success", "评级成功！");
				} else {
					this.$u.toast(result.msg);
				}
			},
			
			/**
			 * 更新评级后底部文字提示
			 */
			updateBottomPromptText(){
				// 评级后的底部文字提示
				if (this.form.orderStatus == '已评价' && this.isNotNull(this.form.grade)) {
					let coupon_range_text = '优惠'
					if(this.form.couponRange == 0){
						coupon_range_text = '单品'
					}else if(this.form.couponRange == 1){
						coupon_range_text = '通用'
					}
					if(this.isNotNull(this.form.reward) && parseFloat(this.form.reward) > 0.0 && this.isNotNull(this.form.couponAmount) && parseFloat(this.form.couponAmount) > 0.0){
						this.bottomPromptText = '，已发¥' + this.form.reward + '现金和¥' + this.form.couponAmount + '元' + coupon_range_text + '券！';
					}
					
					if(this.isNotNull(this.form.reward) && parseFloat(this.form.reward) > 0.0 && (!this.isNotNull(this.form.couponAmount) || parseFloat(this.form.couponAmount) == 0.0)){
						this.bottomPromptText = '，已发¥' + this.form.reward + '现金！';
					}
					
					if(this.isNotNull(this.form.couponAmount) && parseFloat(this.form.couponAmount) > 0.0 && (!this.isNotNull(this.form.reward) || parseFloat(this.form.reward) == 0.0)){
						this.bottomPromptText = '，已发¥' + this.form.couponAmount + '元' + coupon_range_text + '券！';
					}
				}
			},

			/**
			 * 【重要！样品领取前请仔细阅读】 
			 */
			showRules() {
				if (this.show_rule) {
					this.iconName = 'arrow-right'
					this.show_rule = false
				} else {
					this.iconName = 'arrow-down'
					this.show_rule = true
				}
			},

			/**
			 * 前往收益
			 */
			async goToIncomeIndex() {
				uni.reLaunch({
					url: "/pages/index/incomeIndex"
				});
			},

			/**
			 * 跳转到销售机会页面
			 */
			async toGoodsDetails() {
				this.$u.route('/pages_private_scene2/GroupPurchase/DistributionGoods?goodsNo=' + this.form.goodsNo +
					'&goodsId=' + this.form.goodsId);
			}

		}
	}
</script>

<style scoped>
	.swiper-item {
		background-color: rgb(240, 240, 240);
	}

	.flex-space-between {
		justify-content: space-between;
	}

	.search-width {
		width: 75%;
	}

	.color-red {
		color: red;
	}

	.content {
		display: flex;
		align-items: center;
	}

	.box {
		width: 95%;
		background-color: #ffffff;
		padding-top: 20rpx;
		padding-bottom: 20rpx;
		border-bottom: 1rpx #e5e5e5 solid;
		margin: 0 auto;
	}

	.aui {
		width: 95%;
		margin: 0 auto;
	}

	.aui-flex {
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		align-items: center;
		position: relative;
		width: 90%;
		margin: 0 auto;
		height: 80rpx;
		line-height: 80rpx;
		border-top: 2rpx solid #f4f4f4;
		padding-left: 10rpx;
		padding-right: 15rpx;
	}
	
	.aui-flex2 {
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		align-items: center;
		position: relative;
		width: 93%;
		margin: 0 auto;
		height: 85rpx;
		line-height: 85rpx;
		padding-left: 10rpx;
		padding-right: 10rpx;
	}

	.aui-flex-title {
		color: #222;
		font-weight: normal;
		font-size: 1.1rem;
		overflow: hidden;
		width: 75%;
	}

	.aui-flex-box {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
		min-width: 150rpx;
		font-size: 30rpx;
		color: #333;
	}

	.aui-flex-box h1 {
		color: #444444;
		font-weight: 500;
		font-size: 1rem;
		overflow: hidden;
		position: relative;
		padding-left: 1rem;
	}

	.aui-flex-box h2 {
		color: #222;
		font-weight: normal;
		font-size: 1.1rem;
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		word-break: break-all;
		text-overflow: ellipsis;
		padding-left: 1rem;
	}

	.aui-flex-box p {
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		word-break: break-all;
		text-overflow: ellipsis;
		font-size: 0.9rem;
		margin-bottom: 0.1rem;
	}

	.cont-red {
		color: red;
	}

	.cont-bold {
		font-weight: bold;
	}

	.cont-small {
		font-size: smaller;
	}

	.cont-gray {
		color: gray;
	}

	.aui-flex-clear {
		padding: 0;
		margin-top: 20rpx;
	}
	
	.aui-flex-default {
		background: #fff;
	}

	.horizontal-line {
		height: 1rpx;
		background-color: #e0e0e0;
		width: 90%;
		margin: 0 auto;
	}

	.aui-top {
		display: flex;
		justify-content: space-between;
		padding: 30rpx 15rpx 30rpx 30rpx;
	}

	.shop-avatar {
		width: 60rpx;
		height: 50rpx;
		text-align: center;
		padding-right: 10rpx;
	}

	.shop-avatar img {
		width: 100%;
		max-height: 100%;
		vertical-align: top;
		border-radius: 10rpx;
	}

	.u-fb {
		font-weight: bold;
	}

	h3 {
		font-size: 30rpx;
		padding-left: 0
	}

	.h3-limit {
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		word-break: break-all;
		text-overflow: ellipsis;
	}

	.body-title {
		padding: 40rpx 40rpx 15rpx 40rpx;
		font-weight: bold;
	}

	.body-cont {
		padding-left: 40rpx;
		padding-right: 40rpx;
	}

	.conlirow {
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 0rpx 0rpx 40rpx 0rpx;
	}

	.cont-right {
		display: flex;
		flex-direction: column;
	}

	.cont-right p {
		width: 100%;
	}

	.xmname {
		opacity: 0.7;
		font-family: PingFangSC-Regular;
		font-size: 14px;
		color: #3B353C;
		line-height: 22px;
	}

	.name {
		font-family: PingFangSC-Regular;
		font-size: 14px;
		color: #3B353C;
		letter-spacing: 0;
		line-height: 22px;
	}

	.record-bg {
		background-color: #f7f5f5;
	}

	.bg-white {
		background-color: #FFFFFF;
	}

	.body-head {
		display: flex;
		height: 40px;
	}

	.head-icon {
		width: 30px;
	}

	.head-title {
		width: 400px;
		line-height: 80rpx;
	}

	.l-h-1 {
		line-height: 1;
	}

	.p-t-10 {
		padding-top: 10px;
	}

	.f-s-20 {
		font-size: 20px;
	}

	.f-s-10 {
		font-size: 10px;
	}

	.top-area {
		background-color: #f1f0f0;
	}

	.flex-end {
		align-items: flex-end;
	}

	.total-price {
		font-size: 34rpx;
		color: red;
	}

	.border-radius-20 {
		border-radius: 20rpx;
	}

	.border-radius-30 {
		border-radius: 30rpx;
	}

	.return-btn {
		display: flex;
		justify-content: space-between;
		padding-right: 30rpx;
	}

	.slot-content {
		font-size: 28rpx;
		color: #a9a9a9;
		text-align: center;
		margin: 0 auto;
	}

	.notice-bar {
		background-color: #f7591f;
		color: #ffffff;
		text-align: center;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 24rpx;
		/* position: fixed;
		top: 1;
		left: 0;
		right: 0;
		z-index: 3; */
		width: 100%;
	}

	.notice-bar2 {
		background-color: red;
		color: #ffffff;
		text-align: center;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 24rpx;
		/* position: fixed;
		top: 1;
		left: 0;
		right: 0;
		z-index: 3; */
		width: 100%;
		
		/* line-height: 40rpx;
		white-space: normal; */
	}

	.slot-content3 {
		font-size: 32rpx;
		/* color: #bcbcbc; */
		text-align: left;
		width: 85%;
		margin: 0 auto;
		padding-top: 80rpx;
		padding-bottom: 80rpx;
	}

	.goods-name {
		width: 476rpx;
		overflow: hidden;
		/*内容会被修剪，并且其余内容是不可见的*/
		text-overflow: ellipsis;
		/*显示省略符号来代表被修剪的文本。*/
		white-space: nowrap;
		/*文本不换行*/
	}

	.car-icon {
		width: 45rpx;
		height: 45rpx;
		background-image: url(https://dev-1308272144.cos.ap-guangzhou.myqcloud.com/Meily/GroupPurchase/car-icon.png);
		background-size: 100%;
		color: palegreen;
		margin-right: 20rpx;
	}

	.right-icon {
		text-align: right;
		color: #bcbcbc;
		padding-right: 26rpx;
		position: relative;
	}

	.right-icon::after {
		content: " ";
		display: inline-block;
		height: 18rpx;
		width: 18rpx;
		border-width: 5rpx 5rpx 0 0;
		border-color: #bcbcbc;
		border-style: solid;
		-webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
		transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
		position: relative;
		top: -2px;
		position: absolute;
		top: 50%;
		margin-top: -4px;
		right: 2px;
		border-radius: 2px;
	}

	.default-tag {
		padding: 0rpx 5rpx;
		background-color: #e5392b;
		color: #ffffff;
		border-radius: 5rpx;
		font-size: 20rpx;
		margin-right: 10rpx;
	}

	.address1 {
		width: 560rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
	}

	.aui-flex-goods {
		margin-right: .8em;
		width: 150rpx;
		height: 150rpx;
		line-height: 150rpx;
		text-align: center;
	}

	.aui-flex-goods img {
		width: 100%;
		max-height: 100%;
		vertical-align: top;
		border-radius: 15rpx;
	}

	.goods-title {
		width: 470rpx;
		display: -webkit-box;
		/*必须结合的属性,将对象作为弹性伸缩盒子模型显示*/
		-webkit-line-clamp: 1;
		/*设置多少行*/
		-webkit-box-orient: vertical;
		/*必须结合的属性,设置或检索伸缩盒对象的子元素的排列方式*/
		overflow: hidden;
		/*文本会被修剪，并且剩余的部分不可见*/
		text-overflow: ellipsis;
		/*显示省略号来代表被修剪的文本*/
		font-size: 32rpx;
	}

	.aui-flex1 {
		display: flex;
		width: 90%;
		margin: 0 auto;
	}

	.mask-solt {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
	}

	.official-account-bg {
		background: url(https://www-1308272144.cos.ap-guangzhou.myqcloud.com/Meily/icon/Share/ShareofficialAccount.png) no-repeat;
		background-size: 100% 100%;
		width: 540rpx;
		height: 780rpx;
	}

	.pictrues-box {
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 40rpx;
	}

	.comment-title {
		height: 100rpx;
		line-height: 100rpx;
		padding-left: 20rpx;
		width: 90%;
		margin: 0 auto;
		border-bottom: 2rpx solid #f4f4f4;
	}

	.goods-specification {
		font-size: 30rpx;
		color: #9f9d9e;
		width: 470rpx;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.v-sperate {
		height: 10rpx;
		background: #f7f1f7;
	}

	.width93 {
		width: 93%;
		margin: 0 auto;
	}

	.modal-item {
		/* margin: 40rpx 0rpx; */
		height: 100rpx;
		line-height: 40rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		/* color: #9f9d9e; */
		border-top: 1rpx solid #eeeded;
	}

	.rule-title {
		height: 100rpx;
		line-height: 100rpx;
		width: 90%;
		margin: 0 auto;
		font-weight: bold;
	}

	.rule-content {
		width: 90%;
		margin: 0 auto;
		padding-bottom: 20rpx;
		border-bottom: 2rpx solid #f4f4f4;
	}
	
	.copy-btn {
		text-decoration: underline;
		padding-left: 10rpx;
		font-size: 26rpx;
	}
	
	.order-id {
		width: 450rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
</style>